/** @type {import('tailwindcss').Config} */
export default {
  content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
  darkMode: 'class',
  theme: {
    extend: {
      animation: {
        'spin-slow': 'spin 3s linear infinite',
      },
      textShadow: {
        custom: '1px 1px 10px rgba(0, 0, 0, 0.1)',
      },
      typography: (theme) => ({
        DEFAULT: {
          css: {
            h1: {
              fontSize: '1.5em', // 修改标题字体大小
            },
            h2: {
              fontSize: '1.25em',
            },
            h3: {
              fontSize: '1.20em',
            },
            h4: {
              fontSize: '1.10em',
            },
            h5: {
              fontSize: '1.0em',
            },
            h6: {
              fontSize: '1.0em',
            },
          },
        },
        dark: {
          css: {
            color: theme('colors.gray.300'),
            a: {
              color: theme('colors.blue.400'),
              '&:hover': {
                color: theme('colors.blue.600'),
              },
            },
            h1: {
              color: theme('colors.gray.300'),
            },
            h2: {
              color: theme('colors.gray.300'),
            },
            h3: {
              color: theme('colors.gray.300'),
            },
            h4: {
              color: theme('colors.gray.300'),
            },
            h5: {
              color: theme('colors.gray.300'),
            },
            h6: {
              color: theme('colors.gray.300'),
            },
            p: {
              color: theme('colors.gray.300'),
            },
            // 继续添加其他元素的样式
          },
        },
      }),
    },
  },
  plugins: [require('tailwindcss-textshadow'), require('@tailwindcss/typography')],
}
